<template>
  <a-modal :width="1000" v-model:visible="showTaskProgressDialog" title="任务进度" :footer="false" title-align="start" :mask-closable="false" :on-before-ok="submitData" :ok-loading="submitLoading" @cancel="closedDialog">
    <a-radio-group v-model="status" type="button">
      <a-radio :value="1">成功(1)</a-radio>
      <a-radio :value="2">处理中(2)</a-radio>
      <a-radio :value="3">失败(3)</a-radio>
    </a-radio-group>
    <div class="table-model-wrap" style="margin-top: 20px">
      <a-table :columns="columns" size="mini" :data="taskList" :scroll="{ y: 'calc(84vh - 180px)' }" :bordered="false" class="table-two-line table-model" :pagination="false">
        <template #columns>
          <a-table-column title="店铺/站点">
            <template #cell>
              <p>hake onefinity:US</p>
              <p style="color: #ccc">美国</p>
            </template>
          </a-table-column>
          <a-table-column title="任务分类">
            <template #cell> 调价 </template>
          </a-table-column>
          <a-table-column title="操作人">
            <template #cell> system </template>
          </a-table-column>
          <a-table-column title="任务发起时间">
            <template #cell> 2023-06-29 12:00:22 </template>
          </a-table-column>
          <a-table-column title="操作">
            <template #cell>
              <a-button type="text">详情</a-button>
            </template>
          </a-table-column>
        </template>
      </a-table>
    </div>
  </a-modal>
</template>
<script lang="ts" setup>
  import { ref } from 'vue'

  const emit = defineEmits(['closed', 'success'])
  const props = defineProps({
    isShow: {
      type: Boolean,
      default: false,
    },
  })

  const showTaskProgressDialog = ref(props.isShow)
  const isAuto = ref(true)
  const submitLoading = ref(false)
  const status = ref(1)
  const columns = [
    {
      title: '店铺/站点',
      dataIndex: 'shop',
    },
    {
      title: '任务分类',
      dataIndex: 'salary',
    },
    {
      title: '操作人',
      dataIndex: 'address',
    },
    {
      title: '任务发起时间',
      dataIndex: 'email',
    },
    {
      title: '操作',
      dataIndex: 'handle',
    },
  ]
  const taskList = [{}, {}]

  // 关闭
  function closedDialog() {
    isAuto.value = true
    showTaskProgressDialog.value = false
    emit('closed')
  }
  // 提交
  async function submitData() {
    console.log(isAuto.value)
    emit('success')
    closedDialog()
  }
</script>
<style lang="less" scoped>
  .info-text {
    color: #999;
    margin-top: 10px;
  }
</style>
